<!DOCTYPE html>
<html lang="">

<head>

  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">

  <title>注册</title>
  <meta name="keywords" content="">
  <meta name="description" content="">

  <link rel="shortcut icon" href="favicon.ico">
  <link href="/static/hAdmin/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
  <link href="/static/hAdmin/css/font-awesome.css?v=4.4.0" rel="stylesheet">
  <link href="/static/hAdmin/css/plugins/toastr/toastr.min.css" rel="stylesheet">
  <link href="/static/hAdmin/css/animate.css" rel="stylesheet">
  <!--<link href="/static/hAdmin/css/style.css?v=4.1.0" rel="stylesheet">-->
  <link href="/static/hAdmin/css/style.css?version 4.0" rel="stylesheet">
  <!--[if lt IE 9]>
  <meta http-equiv="refresh" content="0;ie.html"/>
  <![endif]-->
  <script>if (window.top !== window.self) {
    window.top.location = window.location;
  }</script>
  <style>
    .bg{
      width: 100%;
      height: 100%;
      background: url("/static/img/back.jpg") ;

      background-size: 100% ;
      opacity: 0.8;

    }
    .disN{
      display: none;
    }
    .disB{
      display: block;
    }
  </style>
</head>

<body class="">
<div class="bg">
  <div class="middle-box text-center loginscreen  animated fadeInDown " >
    <span id="gloUrl" style="display: none"></span>
    <div >
      <div>

        <h1 class="logo-name">R</h1>

      </div>
      <h3 style="color: #a0d9f5">欢迎注册高邮文化宣传🔍</h3>

      <div class="form-group">
        <input type="text" class="form-control" id="account" placeholder="请输入您的账号" name="account" required>
      </div>
      <div class="form-group">
        <input type="password" class="form-control" id="password" placeholder="请输入您的密码" name="password" required>
      </div>
      <div class="form-group">
        <input type="text" class="form-control" id="userName" placeholder="请输入您的昵称"  >
      </div>
<!--      <div class="form-group">-->
<!--        <input type="text" class="form-control" id="idCard" placeholder="请输入您的证件号"  >-->
<!--      </div>-->
<!--      <div class="form-group">-->
<!--        <input type="text" class="form-control" id="phoneNumber" placeholder="请输入您的档案号"  >-->
<!--      </div>-->
      <div class="form-group">
        <input type="text" class="form-control disN" id="lisenCode" placeholder="请输入授权码" name="lisenCode" >
      </div>
      <div class="form-group">
        <select class="form-control" id="gender"  value="1">
          <option value="1">男</option>
          <option value="0">女</option>
        </select>
      </div>
      <div class="form-group">
      <select class="form-control" id="sel" onchange="ifAdmin()" value="1">
        <option value="1">用户</option>
        <option value="2">管理账号(需要授权码)</option>
<!--        <option value="3">当地名人端</option>-->
      </select>
      </div>

      <button type="button" id="register" class="btn btn-primary block full-width m-b">注 册</button>
      <a id="toLogin" href="/web/login" style="color: #9be299;font-size: 16px;font-weight: 700" class="full-width m-b">去登陆</a>

    </div>
  </div>
</div>


<!-- 全局js -->
<!--引用本地的jQuery-->
<!--jquery.min.js版本一般用于网站引用使用，减小文件体积，降低网站流量，提升访问速度等。-->
<script src="/static/hAdmin/js/jquery.min.js?v=2.1.4"></script>

<script src="/static/hAdmin/js/bootstrap.min.js?v=3.3.6"></script>



<!-- 自定义js -->
<!--<script src="/static/hAdmin/js/content.js?v=1.0.0"></script>-->

<script src="/static/js/GloJs.js"></script>
<!-- Toastr script -->
<script src="/static/hAdmin/js/plugins/toastr/toastr.min.js"></script>
<script>
  // let Glo_BaseUrl = "http://123.56.130.75:8086";//云服务器
  // let Glo_BaseUrl = "http://localhost:8086";//本地
  //$(function(){ }实际上是匿名函数。这是JQuery的语法，$表示JQuery对象
  $(function (){
    let Glo_BaseUrl = $("#gloUrl").attr("gloUValue")
    $('#showtoast').click(function () {
//动画
// 消息提示（toastr.options 配置提示框,通过自定义配置，达到不同的效果）
      toastr.options = {
        "closeButton": true,
        "debug": false,
        "progressBar": true,
        "positionClass": "toast-top-right",
        "onclick": null,
        "showDuration": "400",
        "hideDuration": "1000",
        "timeOut": "7000",
        "extendedTimeOut": "1000",
        "showEasing": "swing",
        "hideEasing": "linear",
        "showMethod": "fadeIn",
        "hideMethod": "fadeOut"
      }

    });
    $("#register").click(function (){//点击事件

      if ($("#account").val() !== ""){
        if ($("#password").val() === ""){
          toastr.error("密码不能为空！", '注册失败！')
          return false;
        }
        if ($("#userName").val() === ""){
          toastr.error("昵称不能为空！", '注册失败！')
          return false;
        }
        $.ajax({
          //Glo_BaseUrl 公共的部分
          url: Glo_BaseUrl + "/toRegister",
          //更新添加数据库
          type: "post",
          data: {
            //向后端传的参数
            "account":$("#account").val(),
            "password":$("#password").val(),
            "userName":$("#userName").val(),
            "idCard":$("#idCard").val(),
            "phoneNumber":$("#phoneNumber").val(),
            "gender":$("#gender").val(),
            "role":$("#sel").val(),
            "lisenCode":$("#lisenCode").val(),
          },
          success: function (data) {//后端返回的数据
            if (data.code === 200){
              //setItem(“key”,“value”)：存储名字为key的一个值value，如果key存在，就更新value
              //getItem(“key”)：获取名称为key的值，如果key不存在则返回null**
              localStorage.setItem("userId",data.data)
              toastr.success(data.message, '注册成功！正在自动跳转至登录页面......')
              setTimeout(function (){
                window.location.href = Glo_BaseUrl + "/web/login"
              },1000)

            }else {
              toastr.error(data.message, '注册失败！')



            }
          },
          error: function () {
            alert("服务器异常！network error！")
          }
        })
      }else {
        toastr.error("账号不能为空！", '注册失败！')
        //消息提示（toastr.options 配置提示框,通过自定义配置，达到不同的效果）

      }

    })
  })

function ifAdmin(){
  if ($("#sel").val() === "2" ){//管理员
    $("#lisenCode").addClass("disB").removeClass("disN")//显示
    $("#idCard").removeClass("disB").addClass("disN")//隐藏
    $("#phoneNumber").removeClass("disB").addClass("disN")//隐藏
    $("#gender").removeClass("disB").addClass("disN")//隐藏
  }else {//用户
    $("#lisenCode").addClass("disN").removeClass("disB")//隐藏
    $("#idCard").removeClass("disN").addClass("disB")//显示
    $("#phoneNumber").removeClass("disN").addClass("disB")//显示
    $("#gender").removeClass("disN").addClass("disB")//显示
  }
}

</script>

</body>

</html>
